import React from 'react';
import {
	StyleSheet, Text, View, PixelRatio
} from "react-native";
import { GLOBAL } from '../../../../../config/global';
import { style } from '../../../../../theme/style';
import { SpaceBetween } from '../../../create/_components/SpaceBetween.js';
import MethodUtil from '../../../../../utils/MethodUtil';
import { CURRENCY } from '../../../../../utils/helper';

const scale = GLOBAL.SCALE;


export const PaymentItemSection = (props) => {
	let { data } = props;
	let { paymentApplySource, applyItemList, currency } = data;
	let itemInfo;
	this.num = 0;
	this.speed = 20; //默认显示20条

	this.num = applyItemList && applyItemList.length;
	if (applyItemList && applyItemList.length > this.speed) {
		applyItemList.length = this.speed;
	}

	if (applyItemList && applyItemList.length) {
		itemInfo = applyItemList.map((item, index) => {
			item.currency = currency;
			return (
				<View key={index} style={[styles.itemBox, styles.borders]}>
					<ItemView item={item} paymentApplySource={paymentApplySource} />
				</View>
			)
		})
	}

	return (
		<View>
			{itemInfo}
			{(this.num > this.speed) ? <Text style={styles.total}>总共{this.num}条</Text> : null}
		</View>
	)
}

ItemView = (props) => {
	const { item, paymentApplySource } = props;
	/**
	* paymentApplySource
	* DD 采购订单  RK 采购入库  FP 采购发票  FFP 费用发票  TK 客户退款  FTF 费用关税/增值税   FYF费用预付(港建费)
	*/
	return (
		<View style={[styles.animateBg]}>
			<Text style={styles.itemTitle}>单据号{item.sourceId}</Text>

			{paymentApplySource === 'FP' ? <SpaceBetween fontLeft={{ title: '结算日期' }} fontRight={{ title: item.settleDate }} /> : null}
			{paymentApplySource === 'RK' || paymentApplySource === 'FFP' || paymentApplySource === 'FP' || paymentApplySource === 'FYF' ? <SpaceBetween fontLeft={{ title: '订单号' }} fontRight={{ title: item.orderId }} /> : null}
			{paymentApplySource === 'DD' || paymentApplySource === 'RK' || paymentApplySource === 'TK' ? <SpaceBetween fontLeft={{ title: '付款类型' }} fontRight={{ title: item.orderPayTypeName }} /> : null}
			{paymentApplySource === 'FYF' ? <SpaceBetween fontLeft={{ title: '款项类型' }} fontRight={{ title: item.fundTypeName }} /> : null}
			<SpaceBetween fontLeft={{ title: '本次申请金额' }} fontRight={{ title: CURRENCY.getUnit(item.currency).label + MethodUtil.toThousands(item.applyAmount || 0, 2) + '' + CURRENCY.getUnit(item.currency).text, style: { color: style.color.pink } }} />
			{paymentApplySource === 'DD' || paymentApplySource === 'FP' ? <SpaceBetween fontLeft={{ title: '订单总金额' }} fontRight={{ title: CURRENCY.getUnit(item.currency).label + MethodUtil.toThousands(item.orderAmount || 0, 2) + '' + CURRENCY.getUnit(item.currency).text }} /> : null}
			{/* {paymentApplySource === 'RK' ? <SpaceBetween fontLeft={{ title: '收货量' }} fontRight={{ title: (item.signAuantity || 0) + '' + (item.uomName || '吨') }} /> : null} */}
			{/* {paymentApplySource === 'RK' ? <SpaceBetween fontLeft={{ title: '单价' }} fontRight={{ title: CURRENCY.getUnit(item.currency).label + MethodUtil.toThousands(item.procurementPrice || 0, 2) + '' + CURRENCY.getUnit(item.currency).text }} /> : null} */}
			{/* {paymentApplySource === 'RK' ? <SpaceBetween fontLeft={{ title: '收货金额' }} fontRight={{ title: CURRENCY.getUnit(item.currency).label + MethodUtil.toThousands(item.instockAmount || 0, 2) + '' + CURRENCY.getUnit(item.currency).text }} /> : null} */}
			{
				paymentApplySource === 'DD' || paymentApplySource === 'RK' || paymentApplySource === 'FP' || paymentApplySource === 'TK' ?
					<SpaceBetween fontLeft={{ title: '已付款金额' }} fontRight={{ title: CURRENCY.getUnit(item.currency).label + MethodUtil.toThousands(item.payReceiptAmount || 0, 2) + CURRENCY.getUnit(item.currency).text }} />
					: null
			}
			{
				paymentApplySource === 'DD' || paymentApplySource === 'RK' || paymentApplySource === 'FP' || paymentApplySource === 'TK' ?
					<SpaceBetween fontLeft={{ title: '已申请未付款金额' }} fontRight={{ title: CURRENCY.getUnit(item.currency).label + MethodUtil.toThousands(item.appliedAndNonPayment || 0, 2) + CURRENCY.getUnit(item.currency).text }} />
					: null
			}
			{paymentApplySource === 'DD' ? <SpaceBetween fontLeft={{ title: '合同剩余付款金额' }} fontRight={{ title: CURRENCY.getUnit(item.currency).label + MethodUtil.toThousands(item.contractLimitAmount || 0, 2) + '' + CURRENCY.getUnit(item.currency).text }} /> : null}
			{paymentApplySource === 'RK' ? <SpaceBetween fontLeft={{ title: '收货日期' }} fontRight={{ title: (item.signTime ? item.signTime.split(' ')[0] : '') }} /> : null}
			{paymentApplySource === 'RK' || paymentApplySource === 'FP' ? <SpaceBetween fontLeft={{ title: '付款期限' }} fontRight={{ title: (item.payExpireDays || 0) + '天' }} /> : null}
			{paymentApplySource === 'FTF' ? <SpaceBetween fontLeft={{ title: '订单生成日期' }} fontRight={{ title: (item.orderCreateTime) }} /> : null}
			{paymentApplySource === 'FTF' || paymentApplySource === 'FAT' ? <SpaceBetween fontLeft={{ title: '报关单号' }} fontRight={{ title: (item.customsDeclarationNumber) }} /> : null}

		</View>
	);

}

const styles = StyleSheet.create({
	borders: {
		borderTopWidth: 12 * scale,
		borderStyle: 'solid',
		borderTopColor: style.color.dullGrey,
	},
	itemBox: {
		paddingLeft: 12 * scale,
		paddingRight: 12 * scale,
		paddingBottom: 13 * scale
	},
	animateBg: {
		backgroundColor: style.color.white
	},
	itemTitle: {
		fontSize: 14 * scale,
		color: style.color.themeColor,
		height: 20 * scale,
		lineHeight: 20 * scale,
		marginTop: 12 * scale,
		marginBottom: 12 * scale
	},
	totalPrice: {
		borderBottomWidth: 1 / PixelRatio.get(),
		borderStyle: 'solid',
		borderBottomColor: '#e4e4e4',
		marginTop: 6 * scale,
		paddingTop: 6 * scale,
	},
	total: { width: '100%', textAlign: 'center', marginBottom: 20 * scale }
})